<template>
	<div class="container">
		<div class="headImg">
			<img :src="userInfo.headIcon" alt="" />
		</div>
		<div class="welcome">
			<p>欢迎你</p>
			<p>{{userInfo.username || "产品大神"}}</p>
		</div>
		<div class="merchants">
			<p>商户ID</p>
			<p>{{userInfo.userId || "8464554"}}</p>
		</div>
		<div class="valid">
			<p>有效期至</p>
			<p>{{ time | Time}}</p>
		</div>
		<div class="stroes">
			<p>操作门店</p>
			<p>{{userInfo.username || "产品大神"}}(高薪就业店)</p>
		</div>
	</div>
</template>

<script>
import moment from "moment";
export default {
	data(){
		return {
			userInfo:{},
			time:''
		}
	},
	created(){
		
		let _token = this.$store.state.common._token;
        if (_token) {
            this.$http.post("http://120.76.56.2:3000/user/getUserInfo").then((ret) => {
                if (ret.error == 0) {
                    // 赋值给初始可变数据
                    this.userInfo = ret.data;
					this.time = Date.now()+7200*1000
                }
            });
        }
	},
	filters:{
		Time(date){
			let time = moment(date).format('YYYY-MM-DD hh:mm:ss');
			return time
		}
	}
}
</script>

<style lang="scss" scoped>
.container {
	display: flex;
	padding-top: 20px;
	padding-left: 100px;
	.headImg{
		
		img{
			height: 62px;
			width: 62px;
			border-radius: 50%;
		}
	}
	.merchants {
		margin-left: 170px;
	}
	.valid,
	.stroes {
		margin-left: 80px;
	}
	p {
		font-size: 12px;
		color: #333;
		width: 120px;
		text-align: center;
	}
}
</style>
